{extend name='public/base' /} {block name='seo' /}
<title>{$title|default='标题'}</title>
<meta name="keywords" content="{$keywords|default='关键字'}">
<meta name="description" content="{$desc|default='描述'}"> {/block} {block name='content' /}
<section class="Hui-article-box">
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
        <span class="c-gray en">&gt;</span> 课程管理
        <span class="c-gray en">&gt;</span> 课程列表 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont">&#xe68f;</i></a> </nav>

    <div class="Hui-article">

        <article class="cl pd-20">

            <div class="cl pd-5 bg-1 bk-gray mt-20 ">
                <form action="{:url('course/courseList')}" method="post" class="form-inline text-center">
                    课程名: &nbsp;<input type="text" name="courseName" class="form-control" value="{$courseName}" placeholder="支持课程名模糊搜索"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 课程分类: <select class="form-control" name="courseLevel" id="courseLevel" style="width: 160px;"
                        required></select> &nbsp;&nbsp; <button type="submit" class="btn btn-success">搜索</button>
                </form>
            </div>

            <div class="cl pd-5 bg-1 bk-gray mt-20 ">
                <span class="r ">共有数据：<strong>{$count}</strong> 条</span>
            </div>

            <table class="table table-border table-bordered table-bg ">
                <thead>
                    <tr>
                        <th scope="col" colspan="9">课程列表</th>
                    </tr>
                    <tr class="text-c">
                        <th width="40">ID</th>
                        <th width="100">课程名</th>
                        <th width="150">棋局步数</th>
                        <th width="130">课程分类</th>
                        <th width="130">创建时间</th>
                        <th width="100">创建人</th>
                        <th width="100">操作</th>
                    </tr>
                </thead>
                <tbody>

                    {volist name="courseList" id="vo"}
                    <tr class="text-c">
                        <td>{$vo.id}</td>
                        <td>{$vo.course_name}</td>
                        <td>{$vo.chess_step}</td>
                        <td>{$vo.course_level}</td>
                        <td>{$vo.create_time}</td>
                        <td>{$vo.creator}</td>
                        <td class="td-manage">
                            <input id="{$vo.id}" style="display: none">
                            <a title="复制课程Url" href="javascript:;" onclick="copyCourseUrl(this,{$vo.id})" class="ml-5 " style="text-decoration:none ">
                                <i class="Hui-iconfont">&#xe6ea;</i>
                            </a>
                            <span>&nbsp;&nbsp;&nbsp;</span>
                            <a title="删除" href="javascript:;" onclick="course_del(this,{$vo.id})" class="ml-5 " style="text-decoration:none ">
                                <i class="Hui-iconfont">&#xe6e2;</i>
                            </a>

                        </td>
                    </tr>
                    {/volist}
                </tbody>
            </table>
            <div style="float: right ">
                {$page}
            </div>
        </article>
    </div>
</section>
{/block} {block name='js'}
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript " src="__STATIC__/lib/My97DatePicker/4.8/WdatePicker.js "></script>
<script type="text/javascript " src="__STATIC__/lib/datatables/1.10.0/jquery.dataTables.min.js "></script>
<script type="text/javascript " src="__STATIC__/lib/laypage/1.2/laypage.js "></script>
<script type="text/javascript ">
    /*管理员-删除*/
    function course_del(obj, id) {
        layer.confirm('确认要删除吗？', function(index) {
            //此处请求后台程序，下方是成功后的前台处理……
            $.get("{:url( 'course/courseDelete')} ", {
                id: id
            });

            $(obj).parents("tr ").remove();
            layer.msg('已删除!', {
                icon: 1,
                time: 1000
            });
        });
    }

    // 将课程Url 复制到粘贴板
    function copyCourseUrl(obj, id) {

        var baseUrl = "file:///Users/apple/Documents/Workspaces/PHP/teach-manage/web/exercises.html?id=";
        var aimUrl = baseUrl + id;

        var temInput = document.createElement('input');
        temInput.value = aimUrl;
        document.body.appendChild(temInput);
        temInput.select(); // 选择对象
        document.execCommand("Copy"); // 执行浏览器复制命令
        temInput.className = 'temInput';
        temInput.style.display = 'none';

        layer.msg('复制成功!', {
            icon: 1,
            time: 1000
        });

    }

    //请求加载课程分类
    (function() {

        $.ajax({
            type: "POST",
            url: "{:url('course/fetchCourseLevelData')}",
            dataType: "json",
            success: function(res) {
                if (res.status === 200) {
                    var data = res.data;
                    $("#courseLevel").select2({
                        data: data
                    })
                } else {
                    alert("该练习课程不存在");
                }
            }
        });

    })();
</script>
<!--/请在上方写此页面业务相关的脚本-->
{/block}
</body>

</html>